<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <h1>网站一级标题</h1>
    <ul>
        <li><a href="index.html">导航链接1</a></li>
        <li><a href="index.html">导航链接2</a></li>
        <li><a href="index.html">导航链接3</a></li>
        <li><a href="index.html">导航链接4</a></li>
    </ul>
    <h2>文章一级标题</h2>
    <h2>文章二级标题</h2>
    <span>文章作者</span>
    <span>文章发表时间</span>
    <p>这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a></p>
    <img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片">
    <h2>另一篇文章一级标题</h2>
    <h2>文章二级标题</h2>
    <span>文章作者</span>
    <span>文章发表时间</span>
    <p>这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a></p>
    <img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片">
    <ul>
        <li>列表项目11</li>
        <li>列表项目12</li>
        <li>列表项目13</li>
    </ul>
    <h2>图片</h2>
    <dl>

        <dd>
            <p>好看的图片</p><img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片"></dd>

        <dd>
            <p>好看的图片</p><img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片"></dd>

        <dd>
            <p>好看的图片</p><img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片"></dd>

        <dd>
            <p>好看的图片</p><img src="http://i1.piimg.com/567571/de5fe587470b66d9.jpg" alt="图片"></dd>
    </dl>
    <h2>最后一篇文章标题</h2>
    <h2>文章二级标题</h2>
    <span>文章作者</span>
    <span>文章发表时间</span>
    <ol>
        <li>排名1</li>
        <li>排名2</li>
        <li>排名3</li>
    </ol>
    <p>下面是一个表格，给表格加一个border="1"好让你看出是一个表格</p>
    <table border="1" bgcolor="#abcedr" >
        <thead>
            <tr>
                <th>表头</th>
                <th>表头</th>
                <th>表头</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="">操作</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="">操作</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="">操作</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="">操作</a></td>
            </tr>
            <tr>
                <td>总计</td>
                <td colspan="2">1000</td>
                <td></td>
            </tr>
        </tbody>
    </table>
    <h2>这里以后是一个侧栏，这是侧栏的标题</h2>
    <h2>侧栏注册窗口标题</h2>
    <form action="index.html" method="POST">
        <div class="email"><label for="email">请输入邮箱地址：</label><input type="email" name="email" id="email" placeholder="这是一个文本输入框"></div>
        <div class="password"><label for="password">请输入密码：</label><input type="password" name="password" id="password" placeholder="这是一个文本输入框">
            <label for="repassword">请重复输入密码：</label><input type="password" name="password" id="repassword" placeholder="这是一个文本输入框">
        </div>
        <div class="sex">性别：<input type="radio" name="man" id="man" value="man" checked>男<input type="radio" name="man" id="woman" value="woman">女</div>
        <div class="city">
            城市：
            <select>
                <option value="北京">北京</option>
                <option value="上海">上海</option>
                <option value="深圳">深圳</option>
                
            </select>
        </div>
        <div class="hobby">
            爱好：
            <input type="checkbox" name="sport" id="sport" checked>运动
            <input type="checkbox" name="art" id="art">艺术
            <input type="checkbox" name="science" id="science">科学
        </div>
        <p>个人描述： </p>
        <div class="textarea"><textarea name="TEXT" id="TEXT" cols="30" rows="10"> 多行文本，注意和 type=text的区别</textarea></div>
        <div class="submit"><input type="submit" value="确认提交"></div>


    </form>
    <span>版权所有&copy;</span>







</body>

</html>